<template>
  <el-row>
    <el-form-item label="职业" style="margin-left:15px;width: 150px">
      <el-select v-model="currentClassName" class="m-2" placeholder="请选择您的职业" @change="selectProfessionChange">
        <el-option v-for="item in className" :label="item.value" :value="item.value"/>
      </el-select>
    </el-form-item>
    <el-form-item label="部位" style="margin-left:35px;width: 150px">
      <el-select v-model="partName" class="m-2" placeholder="请选择部位" @change="selectPartChange">
        <el-option v-for="item in partList" :label="item" :value="item"/>
      </el-select>
    </el-form-item>
    <el-form-item label="搜索" style="margin-left:35px;">
      <el-input v-model="equipmentName" placeholder="输入装备名搜索" clearable style="width:200px" @input="equipmentNameChange"/>
    </el-form-item>
    <el-button :icon="Plus" type="info" style="margin-left: 30px" @click="addEquipmentBtn">新增装备</el-button>

  </el-row>
  <el-row>
    <el-table :data="equipmentList" row-key="id" height="80vh" style="width: 100%">
      <el-table-column prop="equipmentName" label="装备" width="300"/>
      <el-table-column prop="coreAttribute" label="核心" width="60"/>
      <el-table-column prop="constitution" label="体" width="60"/>
      <el-table-column prop="physicalDefense" label="物防" width="60"/>
      <el-table-column prop="magicDefense" label="法防" width="60"/>
      <el-table-column prop="criticalStrike" label="会心" width="60"/>
      <el-table-column prop="recovery" label="调息" width="60"/>
      <el-table-column prop="expertise" label="专精" width="60"/>
      <el-table-column prop="armorPenetration" label="破甲" width="60"/>
      <el-table-column prop="accuracy" label="命中" width="60"/>
      <el-table-column prop="equipmentSource" label="来源" width="200"/>
      <el-table-column label="操作" width="200">
        <template #default="scope">
          <el-button :icon="Edit" type="info" circle @click="editEquipmentInfo(scope.row)"/>
          <el-button :icon="Delete" type="danger" style="margin-left: 15px" circle @click="deleteEquipment(scope.row)"/>
        </template>
      </el-table-column>
    </el-table>
  </el-row>


  <el-dialog v-model="editEquipmentInfoDialog" :title="isAddEquipment?'新增装备':'装备编辑'" align-center width="500" :show-close="false" :before-close="()=>{}">
    <el-form :model="equipmentInfo" label-position="right" label-width="100px" style="margin-left: 30px;margin-right: 30px;margin-top: 15px">
      <el-form-item label="部位：">
        <el-select v-model="addPartInfo" value-key="part" placeholder="请选择部位" @change="selectAddPartChange">
          <el-option v-for="item in addPartList" :label="item.part" :value="item"/>
        </el-select>
      </el-form-item>
      <el-form-item label="装备：">
        <el-input v-model="equipmentInfo.equipmentName"/>
      </el-form-item>
      <el-form-item label="等级：">
        <el-input v-model="equipmentInfo.qualityLevel" type="number"/>
      </el-form-item>
      <el-form-item label="星元：">
        <el-input v-model="equipmentInfo.starValue" type="number"/>
      </el-form-item>
      <el-form-item label="核心：">
        <el-input v-model="equipmentInfo.coreAttribute" type="number"/>
      </el-form-item>
      <el-form-item label="体：">
        <el-input v-model="equipmentInfo.constitution" type="number"/>
      </el-form-item>
      <el-form-item label="物防：">
        <el-input v-model="equipmentInfo.physicalDefense" type="number"/>
      </el-form-item>
      <el-form-item label="法防：">
        <el-input v-model="equipmentInfo.magicDefense" type="number"/>
      </el-form-item>
      <el-form-item label="会心：">
        <el-input v-model="equipmentInfo.criticalStrike" type="number"/>
      </el-form-item>
      <el-form-item label="调息：">
        <el-input v-model="equipmentInfo.recovery" type="number"/>
      </el-form-item>
      <el-form-item label="专精：">
        <el-input v-model="equipmentInfo.expertise" type="number"/>
      </el-form-item>
      <el-form-item label="破甲：">
        <el-input v-model="equipmentInfo.armorPenetration" type="number"/>
      </el-form-item>
      <el-form-item label="命中：">
        <el-input v-model="equipmentInfo.accuracy" type="number"/>
      </el-form-item>
      <el-form-item label="来源：">
        <el-select v-model="equipmentInfo.equipmentSource" placeholder="请选装备来源">
          <el-option v-for="item in equipmentSourceList" :key="item" :label="item" :value="item"/>
        </el-select>
      </el-form-item>
      <el-form-item label="特殊效果：">
        <el-input v-model="equipmentInfo.specialAttribute" placeholder="装备附加的特殊词条"/>
      </el-form-item>
      <el-form-item label="龙魂符强化：" v-show="addPartInfo.type>=6" style="align-items: center">
        <el-radio-group v-model="equipmentInfo.isLoongSpiritEnhanced" @change="loongSpiritEnhancedChange">
          <el-radio :label="true" size="large">可以</el-radio>
          <el-radio :label="false" size="large">不可以</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="强化次数：" v-show="addPartInfo.type>=6&&equipmentInfo.isLoongSpiritEnhanced" style="align-items: center">
        <el-input v-model="equipmentInfo.loongSpiritUpgradeCount" placeholder="输入龙魂符强化次数" type="number"/>
      </el-form-item>

    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="editEquipmentInfoDialog=false">关闭</el-button>
        <el-button type="primary" @click="editEquipmentInfoSubmit(equipmentInfo)">
          提交
        </el-button>
      </span>
    </template>
  </el-dialog>
</template>
<script>
import {ElMessage, ElMessageBox} from 'element-plus'
import {Plus, Edit, Delete} from '@element-plus/icons-vue'

export default {
  computed: {
    Delete() {
      return Delete
    },
    Edit() {
      return Edit
    },
    Plus() {
      return Plus
    }
  },
  data() {
    return {
      currentClassName: "青云",
      // 门派列表
      className: [{value: '青云'}, {value: '焚香'}, {value: '鬼王'}, {value: '合欢'}, {value: '灵汐'}],
      allEquipment: [],
      //装备列表
      equipmentList: [],
      //装备部位
      partName: "武器",
      partList: ["武器", "头部", "上身", "手部", "腰部", "脚部", "通用"/*,"护符", "法印", "令牌"*/],
      addPartInfo: {},
      addPartList: [{part: "武器", type: 0}, {part: "头部", type: 1}, {part: "上身", type: 2}, {part: "手部", type: 3}, {part: "腰部", type: 4}, {part: "脚部", type: 5}, {part: "护符", type: 6}, {part: "法印", type: 8}, {part: "令牌", type: 9}],
      equipmentName: "",
      editEquipmentInfoDialog: false,
      equipmentInfo: {isLoongSpiritEnhanced: true},
      equipmentSourceList: ["5人噩梦寒潭戾影", "5人噩梦邪宗天罚", "5人噩梦护塔破冥幻", "5人噩梦侠影渡黄泉", "5人噩梦斩恨踏蚩境", "5人噩梦黑石火龙洞", "5人噩梦弈梦破心魔",
        "10人普通云沙锁黄昏", "10人困难渡厄炼血堂", "10人困难幽劫死灵渊", "10人困难云沙锁黄昏", "10人噩梦渡厄炼血堂", "10人噩梦云沙锁黄昏", "20人困难渡厄炼血堂",
        "20人困难幽劫死灵渊", "20人困难云沙锁黄昏", "20人噩梦幽劫死灵渊", "世界BOSS、灵台妖劫", "商店-桑约·玄套装兑换", "商店-桑约·极套装兑换", "商店-天辰兑换", "商店-寒光铜镜兑换", "商店-稀释凝魂兑换", "商店-稀释灵枷兑换", "商店-银辉晶兑换", "神兵任务"],
      isAddEquipment: false,

    }
  },
  methods: {
    //选择职业监听
    selectProfessionChange(any) {
      this.getFetchData(any, "武器")
    },
    //选择部位
    selectPartChange(any) {
      // this.addPartInfo = any
      if (any === "通用") {
        this.getUniversalEquipmentList()
      } else {
        this.getFetchData(this.currentClassName, any)
      }
    },
    //根据职业获取对应的装备
    async getFetchData(profession, type) {
      this.$http.get('/equipment/filter/' + profession + "/" + type).then(response => {
        if (response.data.code === 200) {
          this.allEquipment = response.data.data
          this.equipmentList = response.data.data

        } else {
          ElMessage.error(response.data.message);
        }
      }).catch(error => {
        console.error('请求出错:', error);
      });
    },
    //获取通用装备
    async getUniversalEquipmentList() {
      this.$http.get("equipment/filter/general").then(response => {
        if (response.data.code === 200) {
          this.allEquipment = response.data.data
          this.equipmentList = response.data.data
        } else {
          ElMessage.error(response.data.message);
        }
      }).catch(error => {
        console.error('请求出错:', error);
      });
    },
    //装备搜索框监听
    equipmentNameChange(name) {
      if (name.length === 0) {
        this.equipmentList = this.allEquipment
      } else {
        this.equipmentList = this.allEquipment.filter(item => item.equipmentName.includes(name))
      }
      if (name.length === 0) {
        if (this.partName === "通用") {
          this.getUniversalEquipmentList()
        } else {
          this.getFetchData(this.currentClassName, this.partName)
        }
      }
    },
    //新增装备按钮
    addEquipmentBtn() {

      ElMessageBox.confirm('确定为【' + this.currentClassName + '】职业新增装备？', '提示', {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        let a = [
          {
            "className": this.currentClassName, "equipmentName": "325龙吟九霄（专精、会心）", "qualityLevel": 325, "starValue": 2918, "coreAttribute": 396,
            "specialAttribute": "带有的灵珠效果等级越高，造成的伤害和治疗越高（最高0.8%）",
            "constitution": 150, "physicalDefense": 307, "magicDefense": 0, "criticalStrike": 35, "recovery": 0, "expertise": 141, "armorPenetration": 0, "accuracy": 0,
            "partType": 3, "equipmentSlot": "手部", "equipmentSource": "商店-稀释灵枷兑换", "isLoongSpiritEnhanced": true, "inlayNum": 0,
            "loongSpiritUpgradeCount": 1, "classSpecialize": "通用", "galaxyType": 0, "galaxyMin": 0, "galaxyMax": 0, "isRandom": 0, "main_attribute": null, "minor_attribute": null
          },

          {
            "className": this.currentClassName, "equipmentName": "325凤舞九天（命中、专精）", "qualityLevel": 325, "starValue": 2918, "coreAttribute": 396,
            "specialAttribute": "造成的属性伤害增加1.2%",
            "constitution": 150, "physicalDefense": 307, "magicDefense": 0, "criticalStrike": 0, "recovery": 0, "expertise": 35, "armorPenetration": 0, "accuracy": 141,
            "partType": 3, "equipmentSlot": "手部", "equipmentSource": "商店-稀释灵枷兑换", "isLoongSpiritEnhanced": true, "inlayNum": 0,
            "loongSpiritUpgradeCount": 1, "classSpecialize": "通用", "galaxyType": 0, "galaxyMin": 0, "galaxyMax": 0, "isRandom": 0, "main_attribute": null, "minor_attribute": null
          },

          {
            "className": this.currentClassName, "equipmentName": "325天罡北斗（会心、专精）", "qualityLevel": 325, "starValue": 2918, "coreAttribute": 396,
            "specialAttribute": "当前武器品质等级每比310增加5点，造成伤害和治疗增加0.1%",
            "constitution": 150, "physicalDefense": 307, "magicDefense": 0, "criticalStrike": 141, "recovery": 0, "expertise": 35, "armorPenetration": 0, "accuracy": 0,
            "partType": 4, "equipmentSlot": "腰部", "equipmentSource": "商店-稀释灵枷兑换", "isLoongSpiritEnhanced": true, "inlayNum": 0,
            "loongSpiritUpgradeCount": 1, "classSpecialize": "通用", "galaxyType": 0, "galaxyMin": 0, "galaxyMax": 0, "isRandom": 0, "main_attribute": null, "minor_attribute": null
          },

          {
            "className": this.currentClassName, "equipmentName": "325天穹之眼（会心、命中）", "qualityLevel": 325, "starValue": 2918, "coreAttribute": 396,
            "specialAttribute": "会心伤害和会心治疗增加1.5%",
            "constitution": 150, "physicalDefense": 307, "magicDefense": 0, "criticalStrike": 141, "recovery": 0, "expertise": 0, "armorPenetration": 0, "accuracy": 35,
            "partType": 4, "equipmentSlot": "腰部", "equipmentSource": "商店-稀释灵枷兑换", "isLoongSpiritEnhanced": true, "inlayNum": 0,
            "loongSpiritUpgradeCount": 1, "classSpecialize": "通用", "galaxyType": 0, "galaxyMin": 0, "galaxyMax": 0, "isRandom": 0, "main_attribute": null, "minor_attribute": null
          },

          {
            "className": this.currentClassName, "equipmentName": "325阴阳双生（专精、会心）", "qualityLevel": 325, "starValue": 3597, "coreAttribute": 484,
            "specialAttribute": "灵药效果增加50%",
            "constitution": 183, "physicalDefense": 307, "magicDefense": 0, "criticalStrike": 45, "recovery": 0, "expertise": 181, "armorPenetration": 0, "accuracy": 0,
            "partType": 5, "equipmentSlot": "脚部", "equipmentSource": "商店-稀释灵枷兑换", "isLoongSpiritEnhanced": true, "inlayNum": 0,
            "loongSpiritUpgradeCount": 1, "classSpecialize": "通用", "galaxyType": 0, "galaxyMin": 0, "galaxyMax": 0, "isRandom": 0, "main_attribute": null, "minor_attribute": null
          },

          {
            "className": this.currentClassName, "equipmentName": "325轮回往生（专精、命中）", "qualityLevel": 325, "starValue": 3597, "coreAttribute": 484,
            "specialAttribute": "每带有一种不同的临时消耗品效果，造成的伤害和治疗增加0.1%",
            "constitution": 183, "physicalDefense": 307, "magicDefense": 0, "criticalStrike": 0, "recovery": 0, "expertise": 181, "armorPenetration": 0, "accuracy": 45,
            "partType": 5, "equipmentSlot": "脚部", "equipmentSource": "商店-稀释灵枷兑换", "isLoongSpiritEnhanced": true, "inlayNum": 0,
            "loongSpiritUpgradeCount": 1, "classSpecialize": "通用", "galaxyType": 0, "galaxyMin": 0, "galaxyMax": 0, "isRandom": 0, "main_attribute": null, "minor_attribute": null
          },

          // {"className":this.currentClassName,"equipmentName":"325幽海通玄·会（会心、命中）","qualityLevel":325,"starValue":2789,"coreAttribute":308,
          //   "specialAttribute":"",
          //   "constitution":123,"physicalDefense":0,"magicDefense":512, "criticalStrike":225,"recovery":0,"expertise":0,"armorPenetration":0,"accuracy":25,
          //   "partType":6,"equipmentSlot":"护符","equipmentSource":"商店-稀释灵枷兑换","isLoongSpiritEnhanced":true,"inlayNum":0,
          //   "loongSpiritUpgradeCount":2,"classSpecialize":"通用","galaxyType":0,"galaxyMin":0,"galaxyMax":0,"isRandom":0,"main_attribute":null,"minor_attribute":null},
          //
          // {"className":this.currentClassName,"equipmentName":"325幽海通玄·专（专精、命中）","qualityLevel":325,"starValue":2789,"coreAttribute":308,
          //   "specialAttribute":"",
          //   "constitution":123,"physicalDefense":0,"magicDefense":512, "criticalStrike":0,"recovery":0,"expertise":225,"armorPenetration":0,"accuracy":25,
          //   "partType":6,"equipmentSlot":"护符","equipmentSource":"商店-稀释灵枷兑换","isLoongSpiritEnhanced":true,"inlayNum":0,
          //   "loongSpiritUpgradeCount":2,"classSpecialize":"通用","galaxyType":0,"galaxyMin":0,"galaxyMax":0,"isRandom":0,"main_attribute":null,"minor_attribute":null},
          //
          // {"className":this.currentClassName,"equipmentName":"325幽海通玄·调（调息、命中）","qualityLevel":325,"starValue":2789,"coreAttribute":308,
          //   "specialAttribute":"",
          //   "constitution":123,"physicalDefense":0,"magicDefense":512, "criticalStrike":0,"recovery":225,"expertise":0,"armorPenetration":0,"accuracy":25,
          //   "partType":6,"equipmentSlot":"护符","equipmentSource":"商店-稀释灵枷兑换","isLoongSpiritEnhanced":true,"inlayNum":0,
          //   "loongSpiritUpgradeCount":2,"classSpecialize":"通用","galaxyType":0,"galaxyMin":0,"galaxyMax":0,"isRandom":0,"main_attribute":null,"minor_attribute":null},
          //
          // {"className":this.currentClassName,"equipmentName":"325幽海通玄·破（破甲、命中）","qualityLevel":325,"starValue":2789,"coreAttribute":308,
          //   "specialAttribute":"",
          //   "constitution":123,"physicalDefense":0,"magicDefense":512, "criticalStrike":0,"recovery":0,"expertise":0,"armorPenetration":225,"accuracy":25,
          //   "partType":6,"equipmentSlot":"护符","equipmentSource":"商店-稀释灵枷兑换","isLoongSpiritEnhanced":true,"inlayNum":0,
          //   "loongSpiritUpgradeCount":2,"classSpecialize":"通用","galaxyType":0,"galaxyMin":0,"galaxyMax":0,"isRandom":0,"main_attribute":null,"minor_attribute":null},
        ]
        // this.ss(a)
        this.isAddEquipment = true
        this.editEquipmentInfoDialog = true
        this.equipmentInfo.id = 0
      })
    },
    async aa(item) {
      try {
        const response = await this.http.post('/equipment/add', item)
        if (response.data.code === 200) {
          return await response
        } else {
          throw new Error(response.data.message)
        }
      } catch (error) {
        throw error
      }
    },
    async ss(list) {
      for (const item of list) {
        try {
          const result = await this.aa(item)
          console.log("成功", result)
        } catch (error) {
          break;
        }
      }
    },
    selectAddPartChange(any) {

    },
    //编辑装备弹窗
    editEquipmentInfo(info) {
      console.log(info)
      this.editEquipmentInfoDialog = true
      this.isAddEquipment = false
      this.equipmentInfo = info

      this.addPartInfo.part = info.equipmentSlot
      this.addPartInfo.type = info.partType
    },
    //删除装备
    deleteEquipment(info) {
      ElMessageBox.confirm('是否要删除【' + info.equipmentName + '】这件装备吗？', '提示', {
        confirmButtonText: "删除",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.$http.delete('equipment/' + info.id)
            .then(response => {
              if (response.data.code === 200) {
                ElMessage.success("删除成功")
                if (info.className === "通用") {
                  this.getUniversalEquipmentList()
                } else {
                  this.getFetchData(this.currentClassName, info.equipmentSlot)
                }
              } else {
                ElMessage.error(response.data.message);
              }
            }).catch(error => {
          ElMessage.error(error.message);
        })
      })

    },
    //提交装备
    editEquipmentInfoSubmit(info) {
      info.equipmentSlot = this.addPartInfo.part
      info.partType = this.addPartInfo.type
      console.log(info)
      if (this.isAddEquipment) {//新增装备
        if (info.partType >= 6) {
          info.className = "通用"
        } else {
          info.className = this.currentClassName
        }
        this.$http.post('/equipment/add', info).then(response => {
          if (response.data.code === 200) {
            this.editEquipmentInfoDialog = false
            ElMessage.success("增加成功")

            if (info.className === "通用") {
              this.partName = "通用"
              this.getUniversalEquipmentList()
            } else {
              this.partName = info.equipmentSlot
              this.getFetchData(this.currentClassName, info.equipmentSlot)
            }
          } else {
            ElMessage.error(response.data.message);
          }
        }).catch(error => {
          ElMessage.error(error.message);
        })
      } else {//编辑装备
        this.$http.post('/equipment/update', info).then(response => {
          if (response.data.code === 200) {
            this.editEquipmentInfoDialog = false
            ElMessage.success("编辑成功")

            if (info.className === "通用") {
              this.getUniversalEquipmentList()
            } else {
              this.getFetchData(this.currentClassName, info.equipmentSlot)
            }
          } else {
            ElMessage.error(response.data.message);
          }
        }).catch(error => {
          ElMessage.error(error.message);
        })
      }
    },
    loongSpiritEnhancedChange(isChecked) {
      console.log(isChecked)
      console.log(this.equipmentInfo.isLoongSpiritEnhanced)
    }
  },
  mounted() {

    this.selectProfessionChange(this.currentClassName)
  }
}
</script>
<style scoped>

</style>